import { RootModel } from '@/store/rootModel';
import { createModel } from '@rematch/core';

export interface ExcelDemoStore {
  selectedStatus: 'mouseDown' | 'mouseUp' | 'none';
  selectData: any;
  lucksheetOptions: any;
  printOptions: {
    width: number;
    height: number;
  };
}

export const readOnlyOption = {
  allowCopy: false, // 是否允许拷贝
  showtoolbar: false, // 是否显示工具栏
  showinfobar: false, // 是否显示顶部信息栏
  showsheetbar: false, // 是否显示底部sheet页按钮
  showstatisticBar: false, // 是否显示底部计数栏
  sheetBottomConfig: false, // sheet页下方的添加行按钮和回到顶部按钮配置
  allowEdit: false, // 是否允许前台编辑
  enableAddRow: false, // 允许增加行
  enableAddCol: false, // 允许增加列
  userInfo: false, // 右上角的用户信息展示样式
  showRowBar: false, // 是否显示行号区域
  showColumnBar: false, // 是否显示列号区域
  sheetFormulaBar: false, // 是否显示公式栏
  enableAddBackTop: false, // 返回头部按钮
  showPrintLine: false, // 是否展示打印边
  // 去掉行号列
  rowHeaderWidth: 0,
  // 去掉列号行
  columnHeaderHeight: 0,
  showstatisticBarConfig: {
    count: false,
    view: false,
    zoom: false,
  },
  showsheetbarConfig: {
    add: false, // 新增sheet
    menu: false, // sheet管理菜单
    sheet: false, // sheet页显示
  },
  forceCalculation: true, // 强制计算公式
  data: [
    {
      name: 'Sheet1',
      color: '',
      index: 0,
      status: 0,
      order: 1,
      celldata: [],
      config: {},
      showGridLines: 0, // 是否显示网格线
    },
  ],
};

export const editorOptions = {
  showGridLines: true,
  allowEdit: true,
  showinfobar: false, // 是否显示顶部信息栏
  showsheetbar: false, // 是否显示底部sheet页按钮
  showstatisticBar: false, // 是否显示底部计数栏
  sheetBottomConfig: false, // sheet页下方的添加行按钮和回到顶部按钮配置
  userInfo: false, // 右上角的用户信息展示样式
  showPrintLine: true, // 展示打印边线
  plugins: [],
  showstatisticBarConfig: {
    count: false,
    view: false,
    zoom: false,
  },
  showsheetbarConfig: {
    add: false, // 新增sheet
    menu: false, // sheet管理菜单
    sheet: false, // sheet页显示
  },
  data: [
    {
      name: 'Sheet1',
      color: '',
      index: 0,
      status: 0,
      order: 1,
      celldata: [],
      config: {},
      showGridLines: 1, // 是否显示网格线
    },
  ],
};

const printReport = createModel<RootModel>()({
  name: 'printReport',
  state: {
    selectData: {},
    selectedStatus: 'mouseDown', // 当前激活
    lucksheetOptions: {
      container: 'luckysheet', // luckysheet为容器id
      title: 'Luckysheet Demo', // 设定表格名称
      lang: 'zh', // 设定表格语言
      ...editorOptions,
    },
    // 打印配置
    printOptions: {
      width: 0,
      height: 0,
    },
  } as ExcelDemoStore,
  reducers: {
    updateState(state, payload: Partial<ExcelDemoStore>) {
      return {
        ...state,
        ...payload,
      };
    },
    updateLucksheetOptions(state, payload: Partial<ExcelDemoStore>) {
      return {
        ...state,
        lucksheetOptions: {
          ...state.lucksheetOptions,
          ...payload,
        },
      };
    },
  },
  effects: (dispatch) => ({
    async getMenusList() {
      return [];
    },
    // 更新打印配置
    async updatePrintOptions(payload: { w: number; h: number }) {
      const lucksheetPrintXDom = document.getElementById('luckysheet-print-line-x');
      const lucksheetPrintYDom = document.getElementById('luckysheet-print-line-y');
      if (lucksheetPrintXDom && lucksheetPrintYDom) {
        lucksheetPrintXDom.style.top = `${payload.w}px`;
        lucksheetPrintYDom.style.left = `${payload.h}px`;
      }
      dispatch.printReport.updateState({
        printOptions: {
          width: payload.w,
          height: payload.h,
        },
      });
    },
  }),
});

export default printReport;
